import {
  observable,
  action
} from "mobx";

import {
  textObj
} from '@/common/EditorConfig';



export default class Editor {
  id = Math.random();
  @observable title = 'mytest';
  @observable htmlBody = [];
  @action addText() {
    // this.title = 'mytest2';
    const temp = this.htmlBody.map((item) => {
      item.active = false;
      return item;
    })
    this.htmlBody = [
      ...temp,
      textObj
    ];
  }
  @action addActive(index) {
    this.htmlBody = this.htmlBody.map((item, inIndex) => {
      if (inIndex === index) {
        item.active = true;
      } else {
        item.active = false;
      }
      return item;
    })
  }
  // 改变单独一项
  @action changeActive = (value, dataset) => {
    // this.htmlBody.
    const current = this.htmlBody.find((v, i) => v.active);
    if (current) {
      current[dataset.name][dataset.key] = value;
    }
  }
  // 改变位置
  @action changeActivePosition = (offset) => {
    const current = this.htmlBody.find((v, i) => v.active);
    if (current) {
      current.style = Object.assign(current.style,offset);
    }
  }
  // 改变大小
  @action changeActiveSize = (property) => {
    const current = this.htmlBody.find((v, i) => v.active);
    if (current) {
      current.style = Object.assign(current.style,property);

    }
  }
}
